<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>栏目管理</title>
    <meta name="renderer" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="format-detection" content="telephone=no" />
    <link rel="stylesheet" href="/static/css/x-admin.css" media="all" />
    <style type="text/css">
        .open{
            border:1px solid #ccc;
            padding: 0 3px 0 3px;
            cursor: pointer;
        }
    </style>
</head>
<body>
<div class="x-nav">
    <span class="layui-breadcrumb"> <a><cite>首页</cite></a> <a><cite>招标管理</cite></a> <a><cite>类目列表</cite></a> </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新"><i class="layui-icon" style="line-height:30px">ဂ</i></a>
</div>
<div class="x-body">
    <xblock>
        <button class="layui-btn" onclick="banner_add('添加类目','leimu_add.html','1000','500')"><i class="layui-icon"></i>添加</button>
        <button class="layui-btn" onclick="member_add('恢复类目','leimu_huifu.html','800','500')"><i class="layui-icon">&#xe640;</i>已删除</button>
        <span class="x-right" style="line-height:40px">共有数据：<span class="layui-badge">{$count}</span> 条</span>
    </xblock>
    <table class="layui-table">
        <thead>
        <tr pid="0">
            <th style="text-align: center;"> 伸缩 </th>
            <th> ID </th>
            <th> 栏目名称 </th>
            <th> 栏目等级 </th>
            <th> 显示状态 </th>
            <th> 操作 </th>
        </tr>
        </thead>
        <tbody id="x-img">
        {foreach name="info" id="v"}
            <tr id="{$v.id}" pid="{$v.pid}">
                <td align="center"><span class="open">+</span></td>
                <td> {$v.id} </td>

                <td>
                    {$v.name}
                </td>

                <td>
                    一级
                </td>
                <td class="td-status">
                    {if condition="$v.state eq 1"}
                    <span class="layui-btn layui-btn-normal " onclick="status('{$v.id}','{$v.state}')" id="statu_{$v.id}">
                    已启用
                </span>
                    {else}
                    <span class="layui-btn layui-btn-danger " onclick="status('{$v.id}','{$v.state}')" id="statu_{$v.id}">
                    已禁用
                </span>
                    {/if}
                </td>
                <td class="td-manage">
                    <a title="编辑" href="javascript:;" onclick="cate_edit('编辑','{:url('leimu_update',['id'=>$v.id])}','1','800','500')" class="ml-5" style="text-decoration:none">
                        <i class="layui-icon"></i>
                    </a>
                    <a title="删除" href="javascript:;" onclick="cate_del(this,'{$v.id}')" style="text-decoration:none">
                        <i class="layui-icon"></i>
                    </a>
                </td>
            </tr>
            {foreach name="$v.list" id="vo"}
                <tr id="{$vo.id}" pid="{$vo.pid}">
                    <td align="center"><span class="open">+</span></td>
                    <td> {$vo.id} </td>

                    <td>
                        {$vo.name}
                    </td>

                    <td>
                        二级
                    </td>

                    <td class="td-status">
                        {if condition="$vo.state eq 1"}
                        <span class="layui-btn layui-btn-normal " onclick="status('{$vo.id}','{$vo.state}')" id="statu_{$vo.id}">
                    已启用
                </span>
                        {else}
                        <span class="layui-btn layui-btn-danger " onclick="status('{$vo.id}','{$vo.state}')" id="statu_{$vo.id}">
                    已禁用
                </span>
                        {/if}
                    </td>

                    <td class="td-manage">
                        <a title="编辑" href="javascript:;" onclick="cate_edit('编辑','{:url('leimu_update',['id'=>$vo.id])}','1','800','500')" class="ml-5" style="text-decoration:none">
                            <i class="layui-icon"></i>
                        </a>
                        <a title="删除" href="javascript:;" onclick="cate_del(this,'{$vo.id}')" style="text-decoration:none">
                            <i class="layui-icon"></i>
                        </a>
                    </td>
                </tr>
            {/foreach}
        {/foreach}
        </tbody>
    </table>
    <div id="page"></div>
</div>
<script src="/static//lib/layui/layui.js" charset="utf-8"></script>
<script src="/static//js/x-layui.js" charset="utf-8"></script>
<script src="/static//js/jquery.min.js" charset="utf-8"></script>
<script>
    layui.use(['laydate','element','laypage','layer'], function(){
        $ = layui.jquery;//jquery
        laydate = layui.laydate;//日期插件
        lement = layui.element();//面包导航
        laypage = layui.laypage;//分页
        layer = layui.layer;//弹出层

        //以上模块根据需要引入

        layer.ready(function(){ //为了layer.ext.js加载完毕再执行
            layer.photos({
                photos: '#x-img'
                //,shift: 5 //0-6的选择，指定弹出图片动画类型，默认随机
            });
        });

    });
    //启用禁用
    function status(id,obj) {
        var caty = obj==true?'你确定要禁用吗？':'你确定要启用吗？';
        layer.confirm(caty,{icon:3,title:'提示信息'},function(index){
            $.ajax({
                url:"{:url('leimu_qiyong')}",
                data:{id:id,state:obj},
                type:'post',
                success:function (res) {
                    if (res.code == 100){
                        if (obj == 1) {
                            $('#statu_' + id).removeClass('layui-btn-normal').addClass('layui-btn-danger');
                            $('#statu_' + id).html('已禁用');
                            layer.msg(res.msg, {icon: 1, time: 1000});
                        }else{
                            $('#statu_' + id).removeClass('layui-btn-danger').addClass('layui-btn-normal');
                            $('#statu_' + id).html('已启用');
                            layer.msg(res.msg, {icon: 1, time: 1000});
                        }
                        setTimeout(function () {
                            window.location.reload();
                        },1000)
                    }else{
                        layer.msg(res.msg,{icon:2,time:1000});
                    }
                }
            })
        })
    }
    //批量删除提交
    function delAll () {
        layer.confirm('确认要删除吗？',{icon:3,title:'提示信息'},function(index){
            //捉到所有被选中的，发异步进行删除
            layer.msg('删除成功', {icon: 1});
        });
    }
    /*添加*/
    function banner_add(title,url,w,h){
        x_admin_show(title,url,w,h);
    }
    function member_add(title,url,w,h){
        x_admin_show(title,url,w,h);
    }
    function adds(title,url,id,w,h){

        url=url+"?id="+id;
        x_admin_show(title,url,w,h);
    }

    // 编辑
    function cate_edit (title,url,id,w,h) {
        url=url+"?id="+id;
        x_admin_show(title,url,w,h);
    }
    /*删除*/
    function cate_del(obj,id){
        layer.confirm('确认要删除吗？',{icon:3,title:'提示信息'},function(index){
            $.ajax({
                type:"post",
                url:"{:url('leidelete')}",
                data:{id:id},
                dataType:"json",
                success:function(res)
                {
                    console.log(res)
                    if(res.status==1)
                    {
                        layer.msg(res.info, {icon: 6,time:2000},function () {
                            window.location.reload();
                        });
                        return false;

                    }
                    else{
                        layer.msg(res.info,{icon:5,time:2000});return false;
                    }
                }
            });

        });
    }

    //栏目伸缩状态js
    $('tr[pid!=0]').hide();
    $('.open').click(function(){
        var id=$(this).parents('tr').attr('id');//获取他父级的父级的id值
        if($(this).text()=='+'){
            $(this).text('-');
            $('tr[pid='+id+']').show();
        }else{
            $(this).text('+');
            $('tr[pid='+id+']').hide();
            $.ajax({
                type:"post",
                dataType:"json",
                data:{cateid:id},
                url:"",
                success:function(data){
                    //
                    var sonids=[];
                    var idsobj=$('tr[pid!=0]');
                    idsobj.each(function(k,v){
                        sonids.push($(this).attr('id'));
                    });
                    //alert(data);return false;
                    $.each(data,function(k,v){
                        //alert(v);return false;
                        if($.inArray(v,sonids)){
                            //
                            /*for (var i=0;i<sonids.length;i++)
                            {
                            $('tr[id='+sonids[i] +']').hide();
                            $('tr[id='+sonids[i]+']').find('span:first').text('+');
                            }*/
                            $('tr[pid='+v+']').hide();
                            $('tr[pid='+v+']').find('span:first').text('+');

                        }
                    });
                }
            })

        }
    });
</script>
</body>
</html>